<template>
  <div class="body">
    <el-card>
      <!-- 考试信息 -->
      <el-descriptions
        title="考试信息"
        direction="horizontal"
        :column="2"
        border
      >
        <el-descriptions-item label="考试名称">{{
          datas.examPaper
        }}</el-descriptions-item>
        <el-descriptions-item label="考试时间">{{
          datas.examTime
        }}</el-descriptions-item>
        <el-descriptions-item label="考试日期">{{
          datas.examinationDate
        }}</el-descriptions-item>
        <el-descriptions-item label="答题时间"
          >{{ datas.answerTime }}分钟
        </el-descriptions-item>
        <el-descriptions-item label="考点"
          >{{ datas.locName }}
        </el-descriptions-item>
        <el-descriptions-item label="考试类型"
          >{{ datas.examType }}
        </el-descriptions-item>
      </el-descriptions>
      <el-descriptions
        v-for="(item, index) in datas.examinationRoomInformation"
        :key="index"
        direction="horizontal"
        :column="2"
        border
      >
        <el-descriptions-item label="考场ID"
          >{{ item.id }}
        </el-descriptions-item>
        <el-descriptions-item label="容纳人数"
          >{{ item.number }}
        </el-descriptions-item>
        <el-descriptions-item label="考场名称">
          {{ item.roomName }}
        </el-descriptions-item>
        <el-descriptions-item label="考场地点"
          >{{ item.roomPlace }}
        </el-descriptions-item>
      </el-descriptions>
      <!-- 试卷信息 -->
      <el-descriptions
        title="试卷信息"
        direction="horizontal"
        :column="2"
        v-for="(item, index) in datas.paperInformation"
        :key="index"
        border
      >
        <el-descriptions-item label="选择试卷">{{
          item.paperId
        }}</el-descriptions-item>
        <el-descriptions-item label="考试日期">{{
          item.subjectTime
        }}</el-descriptions-item>
        <el-descriptions-item label="选择科目">{{
          item.subjectName
        }}</el-descriptions-item>
      </el-descriptions>
      <!-- 考生信息 -->
      <div style="line-height: 60px; font-weight: 800">考生信息</div>
      <el-table
        ref="multipleTable"
        :data="datas.studentList"
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column label="序号" type="index" width="50">
        </el-table-column>
        <el-table-column label="姓名" prop="studentName"> </el-table-column>
        <el-table-column label="证件号" prop="idCardNo"> </el-table-column>
        <el-table-column prop="gender" label="性别">
          <template slot-scope="scope">
            <div v-if="scope.row.gender == 0">男</div>
            <div v-if="scope.row.gender == 1">女</div>
          </template>
        </el-table-column>
        <el-table-column prop="concact" label="联系电话"> </el-table-column>
      </el-table>
    </el-card>
  </div>
</template>
<script>
import { examinationDetatilApi } from "@/api/testManagement/Examination.js";
import { getTextPagerListApi } from "../../api/onlinehomework/textPager.js";
import { getCourseListApi } from "../../api/basics/course.js";
import { getClassifyListApi } from "../../api/basics/classify.js";
export default {
  data() {
    return {
      datas: {},
    };
  },
  methods: {
    // 获取通过点击修改传递的id返回的数据
    async getDetail() {
      const list = await examinationDetatilApi({
        examId: Number(this.$route.query.id),
      });
      console.log(list.data, "list");
      this.datas = list.data;
      this.datas.examinationRoomInformation = JSON.parse(
        this.datas.examinationRoomInformation
      );
      this.datas.paperInformation = JSON.parse(this.datas.paperInformation);
      const data = await getTextPagerListApi();
      const datas = await getCourseListApi();
      this.datas.paperInformation.forEach((item) => {
        data.rows.forEach((ite) => {
          if (item.paperId == ite.id) {
            item.paperId = ite.paperName;
          }
        });
        datas.rows.forEach((ite) => {
          if (item.subjectName == ite.courseId) {
            item.subjectName = ite.courseName;
          }
        });
      });
      const kaoshiList = await getClassifyListApi({ parentId: 147 });
      kaoshiList.rows.forEach((item) => {
        if (item.typeId == this.datas.examType) {
          this.datas.examType = item.typeName;
        }
      });
    },
    formatDate1(d) {
      var date = new Date(d);
      var YY = date.getFullYear() + "-";
      var MM =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      var DD = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
      return YY + MM + DD;
    },
    async getKecheng() {},
  },
  mounted() {
    this.getDetail();
  },
  computed: {},
  watch: {},
};
</script>
<style lang="scss" scoped>
.body {
  width: 100%;
  padding: 20px;
  min-width: 100vh;
  ::v-deep .el-input__inner {
    height: 30px;
  }
  .label {
    width: 100px;
    display: inline-block;
    text-align: right;
  }
  .mt12 {
    margin-top: 12px;
  }
  .flex1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .flex {
    display: flex;
    justify-content: center;
  }
  ::v-deep .el-descriptions {
    margin-top: 12px;
  }
}
</style>
